import React from 'react';
import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
import { BookList } from './components/BookList';
import { ChapterListWrapper } from './components/ChapterListWrapper';
import { Reader } from './components/Reader';
import { books } from './data/books';

const App: React.FC = () => {
  return (
    <Router>
      <div className="min-h-screen bg-gray-100">
        <Routes>
          <Route path="/" element={<BookList books={books} />} />
          <Route path="/book/:bookId" element={<ChapterListWrapper />} />
          <Route path="/book/:bookId/chapter/:chapterId" element={<Reader />} />
        </Routes>
      </div>
    </Router>
  );
};

export default App;
